pip3 install wtforms
테스트 환경: /Users/csian/Desktop/CP/Python/flask/1st_flask_app_2
1st_flask_app_2/
app.py
static/
style.css
templates/
_formhelpers.html
first_app.html
hello.html
app.py
from flask import Flask, render_template, request
from wtforms import Form, TextAreaField, validators
app=Flask(__name__)
class HelloForm(Form):
sayhello=TextAreaField('', [validators.DataRequired()])
@app.route('/')
def index():
form=HelloForm(request.form)
return render_template('first_app.html', form=form)
@app.route('/hello', methods=['POST'])
def hello():
form=HelloForm(request.form)
if request.method=='POST' and form.validate():
name=request.form['sayhello']
return render_template('hello.html', name=name)
return render_template('first_app.html', form=form)
if __name__=='__main__':
app.run(debug=True)
app.run(host=“192.168.45.xxx”, port=5000)과 같이 임의로 바꿀수도 있다.
1. index 함수를 확장해서 wtforms의 TextAreaField 클래스를 사용하여 시작 웹 페이지에 텍스트 필드를 추가
사용자의 입력 텍스트가 안전한지 아닌지를 자동으로 확인한다.
2. hello를 정의하여 HTML 폼으로 내용을 검증한 후 hello.html 페이지를 출력
3. 퐁에 입력된 데이터를 HTTP 바디(body)에 실어 서버로 전송하는 POST 메서드를 사용, app.run메서드의
debug=True 매개변수를 설정해서 플라스크 디버거(debugger)를 활성화
Jinja2 템플릿 엔진을 이용한 매크로 구현https://jinja.palletsprojects.com/
{% %} 사이에 파이썬 표현식을 넣을 수 있으며, 단순한 변수 값을 출력하기 위해 많이 사용된다.
_formhelpers.html
{% macro render_field(field) %}
<dt>{{ field.label }}
<dd>{{ field(**kwargs)|safe }}
{% if field.errors %}
<ul class=errors>
{% for error in field.errors %}
<li>{{ error }}</li>
{% endfor %}
</ul>
{% endif %}
</dd>
</dt>
{% endmacro %}
CSS로 스타일 추가CSS(Cascading Style Sheet)
style.css
first_app.html
<!doctype html>
<html>
<head>
<title>first Application</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
{% from "_formhelpers.html" import render_field %}
<div>Please enter your Name.</div>
<form method=post action="/hello">
<dl>
{{ render_field(form.sayhello) }}
</dl>
<input type=submit value='enter Name' name='submit_btn'>
</form>
</body>
</html>
hello.html
<!doctype html>
<html>
<head>
<title>first Application</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style_css') }}">
</head>
<body>
<div>Hello {{ name }}!!</div>
</body>
</html>